<template>
  <el-dialog
    title="客户护理项目设置"
    :close-on-click-modal="false"
    width="65%"
    :visible.sync="visible">
    <el-select v-model="levelId" @change="levelChange" placeholder="请选择级别">
        <el-option
          v-for="item in levelList"
          :key="item.id"
          :label="item.levelname"
          :value="item.id">
        </el-option>
      </el-select>
    <el-table
      :data="tableData"
      style="width: 100%">
      <el-table-column
        prop="id"
        label="序号"
        >
      </el-table-column>
      <el-table-column
        prop="serialnumber"
        label="编号"
        >
      </el-table-column>
      <el-table-column
        prop="nursingname"
        label="名称"
        >
      </el-table-column>

      <el-table-column
        prop="serviceprice"
        label="价格"
        >
      </el-table-column>
      <el-table-column
        prop="executioncycle"
        label="执行周次">
      </el-table-column>
      <!-- <el-table-column label="服务购买时期" width="180">

        <template slot-scope="scope">
            <el-input-number size="mini" value="1"  v-model="scope.row.nurseNumber" :min="1" />
        </template>
      </el-table-column> -->

      <el-table-column

        width="140"
        label="购买数量">
        <template slot-scope="scope">
            <el-input-number size="mini" v-model="scope.row.nurseNumber" :min="1" />
          </template>
      </el-table-column>

      <el-table-column

        align="center"
        width="240"
        label="服务到期日期">
        <template slot-scope="scope">
          <el-date-picker
          size="mini"
          v-model="scope.row.endDate"
          type="date"
          value-format="yyyy-MM-dd"
          placeholder="选择日期">
        </el-date-picker>
        </template>

      </el-table-column>
    </el-table>
    <br>
    <el-row>
      <el-button @click="visible = false">取消</el-button>
      <el-button type="primary" @click="submitForm">确定</el-button>
    </el-row>
  </el-dialog>
</template>

<script>
  export default {
    data () {
      return {
        levelId: '',
        visible: false,
        dataForm: {
          id: 0,
          levelid: '',
          itemid: ''
        },
        customerId: '',
        endDate:'',
        num: 1,
        startDate: '当前系统时间',
        levelList: [],
        tableData: [],
        dataRule: {
          levelid: [
            { required: true, message: '关联护理级别不能为空', trigger: 'blur' }
          ],
          itemid: [
            { required: true, message: '关联护理项目不能为空', trigger: 'blur' }
          ]
        }
        }
        },
    created(){
      this.$http({
        url: this.$http.adornUrl(`/nurselevel/nurselevel/listLevel`),
        method: 'get',
        params: this.$http.adornParams()
      }).then(({data}) => {
        if (data && data.code === 0) {
          this.levelList = data.levelList
            console.log(data.levelList)
        }
      })
    },
    methods: {
       removeCoustemrNurseLevel(row){
        this.$http({
          url: this.$http.adornUrl(`/customer/customer/removeLevelConfig/${row.id}/${row.levelid}`),
          method: 'delete',
          params: this.$http.adornParams()
        }).then(({data}) => {
          if (data && data.code === 0) {
            window.location.reload()

          } else {
            this.dataList = []
            this.totalPage = 0
          }
          this.dataListLoading = false
        })
      },
       // 添加客户护理项目
       submitForm(){
         // 遍历tableData，获取选中的项目
         this.tableData.forEach(element =>{
          this.$http({
              url: this.$http.adornUrl('/customer/customer/addItemToCustomer'),
              method: 'post',
              data: this.$http.adornData({
                'itemid': element.id,
                'customerid': this.customerId,
                'levelid': this.levelId,
                'nursenumber': element.nurseNumber,
                'isdeleted': 0,
                'buytime': this.dateFormat(new Date()),
                'maturitytime': element.endDate
              })
            }).then(({data}) => {
              if (data && data.code === 0) {
                  this.$message.success('添加成功')
              }
            })
         })

      },
      nurseContentByLevelId(levelId){
        this.$http({
            url: this.$http.adornUrl(`/nurselevel/nurselevel/nurseContentByLevelId/${levelId}`),
            method: 'get',
            params: this.$http.adornParams()
          }).then(({data}) => {
            if (data && data.code === 0) {
              this.tableData = data.nurseContentList
                console.log(data.nurseContentList)
            }
          })
      },
      levelChange(value){
        // 根据级别查询对应护理项目
        console.log('levelChange---------value:',value)
        this.nurseContentByLevelId(value)

      },
     deleteHandle(itemId) {
      this.$nextTick(() => {
        this.$http({
          url: this.$http.adornUrl(`/nurselevel/nurselevel/deleteNurseLevel/${this.levelId}/${itemId}`),
          method: 'get',
        }).then(({ data }) => {
          if (data && data.code === 0) {
            this.$message.success("删除成功")
             this.visible = false

          }
        })
      })
    },
      init (id) {
         this.levelId=''
         this.tableData=[]
         this.visible = true
        this.customerId=id
        // this.$nextTick(() => {
        //     this.$http({
        //       url: this.$http.adornUrl(`/nurselevel/nurselevel/nurseContentByLevelId/${id}`),
        //       method: 'get',
        //       params: this.$http.adornParams()
        //     }).then(({data}) => {
        //       if (data && data.code === 0) {
        //         console.log(data.nurseContentList)
        //         this.tableData=data.nurseContentList
        //       }
        //     })
        //   }


        // )
      },
        // 年月日 不带时分
        dateFormat(timestamp) {
        if (!timestamp) {
          return timestamp
        }
        // timestamp是整数，否则要parseInt转换,不会出现少个0的情况
        const time = new Date(timestamp)
        const year = time.getFullYear()
        const month = time.getMonth() + 1
        const date = time.getDate()
        return year + '-' + month + '-' + date
      }
      
    }
  }
</script>
